<template>
  <el-row style="margin-top: 15px;">
    <el-col :span="14" :push="5">
      <el-input placeholder="请输入内容" v-model="searchContext.input3" @change="onSend" class="input-with-select">
        <el-select v-model="searchContext.type" slot="prepend" placeholder="请选择">
          <el-option label="图片" value="1"></el-option>
          <el-option label="画师" value="2"></el-option>
          <el-option label="ID" value="3"></el-option>
        </el-select>
        <el-button slot="append" icon="el-icon-search" @click="onSend"></el-button>
      </el-input>
    </el-col>
  </el-row>
</template>

<script>
  export default {
    data() {
      return {
        searchContext:{
          type: '1',
          input3: ''
        }
      };
    },
    methods: {
      onSend() {
        if(this.searchContext.input3.trim().length>0){
          this.$store.state.searchText = this.searchContext.input3.trim();
          this.$emit('clickSearch');
        }
      }
    }
  };
</script>

<style>
  .el-select .el-input {
    width: 100px;
  }
</style>
